import React, { useEffect, useState } from 'react'
import { useSearchParams, useNavigate } from 'react-router-dom'
import { LeftOutline, EnvironmentOutline, UserOutline } from 'antd-mobile-icons'
import './Job.scss'
import { getJob } from "../../utils/request"

export default function Position() {
  const [data, setData] = useState([])
  const [searchParams] = useSearchParams()
  const navigate = useNavigate()

  useEffect(() => {
    const id = searchParams.get('_id')
    getJob({ _id: id }).then(res => {
      setData(res.data.plist)
    })
  }, [])


  return (
    <div className='position'>
      <div className='position-top' onClick={() => { navigate('/app/job') }}>
        <LeftOutline className='position-top-icon' />
      </div>
      <div className='position-content'>
        {
          data.map((item, index) => {
            return <div className='position-content-item' key={item._id} >
              <div className='item-box'>
                <div className='item-img'>
                  <img src={`/src/component/ysh/imgs/` + item.companyLogo} alt="" />
                </div>
                <p>{item.postName}</p>
                <div className='item-address'>
                  <div className='item-address-right'>
                    <EnvironmentOutline className='right-icon' />
                    <span>{item.companyAddress}</span>
                  </div>
                </div>
              </div>
              {/*工作详情*/}
              <div className='position-box'>
                <div className='box'>
                  <span>工作详情</span>
                </div>
                {/*职位描述*/}
                <div className='box1'>
                  <span>职位描述</span>
                  <div className='box1-text'>
                    <p>1.根据要求进行产品IOS,Android,PC端的设计和优化;</p>
                    <p>2.管理和指定UI规范及交互设计原则,把控UI设计质量;</p>
                    <p>3.理解业务和产品规划,对用户体验负责,提升专业能力;</p>
                    <p>4.跟踪业界的可用户性设计趋势,提出改进建议。</p>
                  </div>
                </div>
                {/*任职要求*/}
                <div className='box2'>
                  <span>任职要求</span>
                  <div className='box2-text'>
                    <p>1.本科及以上学历,2年以上UI设计工作经验;</p>
                    <p>2.熟悉UI设计流程,对交互设计、可用性设计、用户研究有较深理解;</p>
                    <p>3.具备良好的沟通、协调能力,具备团队协作精神;</p>
                    <p>4.具备良好的审美能力,对色彩、版式、交互设计有较深理解;</p>
                  </div>
                </div>
                {/*所需技能*/}
                <div className='box3'>
                  <span>所需技能</span>
                  <div className='box3-text'>
                    <p>1.5年以上UI设计工作经验。</p>
                    <p>2.精通Sketch,Figma,Photoshop。如果您使用过Invision,Zeplin,Principle等应用程序,您将获得额外奖励。</p>
                    <p>3.能够创建高保真和低保真线框和原型。</p>
                    <p>4.具备良好的沟通、协调能力,具备团队协作精神。</p>
                    <p>5.具备良好的审美能力,对色彩、版式、交互设计有较深理解。</p>
                    <p>6.具备良好的学习能力,对新技术有强烈的好奇心。</p>
                  </div>
                </div>
              </div>
            </div>
          })
        }
      </div>
    </div>
  )
}
